<template>
  <div>
    <el-table
        v-loading="loading"
        current-row-key="tourismId"
        :data="tourismList"
        border
        stripe
        :highlight-current-row="true"
        style="width: 100%"
    >
      <el-table-column align="center"
      >
        <template v-slot="scope">
          <a @click="showInfo(scope.row)" style="cursor: pointer;color: #e75f1d; font-size: large">{{ scope.row.tourismTitle }}</a>
        </template>
      </el-table-column>
    </el-table>
    <!--分页组件-->
    <div class="pagination-container">
      <el-pagination
          class="pagination"
          @current-change="handleCurrentChange"
          :current-page="pagination.currentPage"
          :page-size="pagination.pageSize"
          layout="total, prev, pager, next, jumper"
          :total="pagination.total">
      </el-pagination>
  </div>
  </div>
</template>

<script>
export default {
  name: "u_tourism",
  data() {
    return {
      tourismList: [],
      loading: true,
      pagination: {
        //分页相关模型数据
        currentPage: 1,//当前页码
        pageSize: 9,//每页显示的记录数
        total: 0,//总记录数
        tourismAddress: "",
      },
    }
  },
  created() {
    this.getAll();
  },
  methods: {
    getAll(){
      let paramStr = "?tourismAddress=" + this.pagination.tourismAddress;
      this.axios
          .get("/tourism/page/" + this.pagination.currentPage + "/" + this.pagination.pageSize + paramStr)
          .then(res => {
            // console.log(res.data);
            this.pagination.currentPage = res.data.data.current;
            this.pagination.pageSize = res.data.data.size;
            this.pagination.total = res.data.data.total;
            this.tourismList = res.data.data.records;
            this.loading = false;
          });
    },
    //切换页码
    handleCurrentChange(currentPage) {
      // 修改页码值为当前选中的页码值
      this.pagination.currentPage = currentPage;
      // 执行查询
      this.getAll();
    },
    showInfo(row){
      this.$router.push({
        path: "/user_index/u_tourismInfo",
        query:{
          tourismId: row.tourismId,
        }
      })
    }
  }
}
</script>

<style scoped>

</style>